const Angle_step = 45.0;

function animate (angle) {
    let now = Date.now();
    let elapsed = now - currentTime;
    currentTime = now;
    let nextAngle = angle + (Angle_step * elapsed) / 1000.0;
    return nextAngle %= 360;
}

function draw (gl, pointNum, currentAngle, matData, u_Mat) {
    matData.setRotate(currentAngle, 0, 0, 1);

    // 同族不同阶函数
    gl.uniformMatrix4fv(u_Mat, false, matData.elements);

    gl.clear(gl.COLOR_BUFFER_BIT);
}

function tick () {
    currentAngle = animate(currentAngle);

    draw(gl, 3, currentAngle, matData, uMatLocation);

    requestAnimationFrame(tick);
}

let gl = getGlByCanvasId("canvas");
let program = getProgram();
// z、w自动补齐
let posData = new Float32Array([
    0, 0,
    0, -1,
    0.7, 0
]);
const colorData = new Float32Array([
    1.0, 0, 0, 1,
    0, 1.0, 0, 1,
    0, 0, 1.0, 1
]);

let matData = new Matrix4();
let currentAngle = 0.0;
let currentTime = Date.now();

let vertexLocation = flushAttrBuffer(program, "a_position", posData);
gl.vertexAttribPointer(vertexLocation, 2, gl.FLOAT, false, 0, 0);

let colorLocation = flushAttrBuffer(program, "a_color", colorData);
gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, false, 0, 0);

let uMatLocation  = gl.getUniformLocation(program, "u_matrix4");

gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
gl.clearColor(0.5, 0.7, 0.4, 1.0);
gl.useProgram(program);

tick();
